<!-- 公司端我的接单：申请的列表 -->
<template>
    <view class="nova-column box">
        <text class="title">申请的阿姨</text>
        <view class="nova-row-center" v-for="(item, index) in corps" :key="index">
            <image class="head" :src="item.photo"></image>
            <view class="nova-column aunty" style="margin-left: 28rpx;">
                <text>{{ item.name }}</text>
                <text style="font-size: 22rpx;margin-top: 20rpx;">匹配度{{ item.number }}</text>
            </view>
            <view style="flex: 1;"></view>
            <text class="more" @click="_recommend(item)">推荐</text>
        </view>
        <uni-popup type="center" ref="corp" class="popup">
            <view class="content nova-column" v-if="company">
                <image class="logo" :src="company.headimg"></image>
                <text class="title">公司信息</text>
                <view class="nova-column" style="margin-top: 18rpx; margin-bottom: 27rpx;">
                    <text class="desc">{{ getPopContents(company) }}</text>
                </view>
                <text class="text-link">法人认证</text>
                <image class="close" src="../../static/img/popup-close.png" @click.stop="showCorpPopup(false)"></image>
            </view>
        </uni-popup>
    </view>
</template>

<script>
import uniPopup from '../../components/uni-popup/uni-popup.vue';
export default {
    name: 'c-auntys',
    components: {
        uniPopup
    },
    props: {
        corps: {
            type: Array,
            default: () => []
        },
        job_status: {
            type: Number,
            default: 0
        },
        publish_id: {
            type: String,
            default: ''
        }
    },
    data() {
        return {
            company: undefined
        };
    },
    methods: {
        showDetail(corp) {
            this.company = corp;
            this.showCorpPopup(true);
        },
        // 查看公司信息详情弹窗 -- 公司信息数据组织
        getPopContents(c) {
            let arr = [];
            if (c.company_name) {
                arr.push(`名称：${c.company_name}`);
            }
            if (c.company_telephone) {
                arr.push(`电话：${c.company_telephone}`);
            }
            if (c.company_address) {
                arr.push(`地址：${c.company_address}`);
            }
            if (c.company_introduce) {
                arr.push(`公司介绍：${c.company_introduce}`);
            }
            return arr.join('\n');
        },
        showCorpPopup(show) {
            this.corpPopup = show;
            if (show) {
                this.$refs.corp.open();
            } else {
                this.$refs.corp.close();
            }
        },
        _recommend(item) {
            let e = {
                resume_id: item.resume_id
            }
            this.$emit('recommend', e);
        }
    },
    created() {
        console.log('auntyList', this.corps);
    }
};
</script>

<style lang="scss">
.box {
    padding: 20rpx 34rpx;
    .title {
        font-size: 30rpx;
        color: #333;
        padding-bottom: 20rpx;
    }
    .head {
        width: 90rpx;
        height: 90rpx;
        margin: 20rpx 0;
        border-radius: 6rpx;
        background-color: #f2f2f2;
    }
    .more {
        color: $uni-color-primary;
        font-size: 24rpx;
    }
    .aunty {
        color: #666;
        font-size: 26rpx;
    }
}
.popup {
    .content {
        position: relative;
        width: 680rpx;
        margin: 34rpx;
        border-radius: 32rpx;
        background-color: white;
        padding: 120rpx 20rpx 30rpx 34rpx;

        .logo {
            width: 200rpx;
            height: 200rpx;
            border-radius: 100rpx;
            box-shadow: 0 0 1 1 $uni-color-primary;
            position: absolute;
            top: -100rpx;
            left: 240rpx;
        }

        .close {
            width: 68rpx;
            height: 68rpx;
            position: absolute;
            bottom: -100rpx;
            left: 294rpx;
        }

        .title {
            font-size: 36rpx;
            color: #333;
        }

        .desc {
            font-size: 28rpx;
            color: #999;
            line-height: 40rpx;
        }
    }
}
</style>
